<template>
  <div class="home">
    <BWCJ-MyEcharts :option="chartOption"  :responsive="true"></BWCJ-MyEcharts>
  </div>
</template>

<script setup>

import { reactive } from 'vue';

const chartOption = reactive({
  TITLE_TEXT: '示例1',
  LEGEND_DATA: ['Email'],
  XAXIS_DATA: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"],
  SERIES: [
    // {
    //   name: '销量',
    //   data: [5, 20, 36, 10, 10, 20],
    // },
    {
      name: 'Email',
      stack: 'Total',
      data: [120, 132, 101, 134, 90, 230, 210],
    }
    // {
    //   name: '111111111111111',
    //   radius: ['40%', '70%'],
    //   itemStyle: {
    //     borderColor: '#fff',
    //     borderWidth: 2
    //   },
    //   label: {
    //     show: false
    //   },
    //   data: [
    //     { value: 1048, name: 'Search Engine' },
    //     { value: 735, name: 'Direct' },
    //     { value: 580, name: 'Email' },
    //     { value: 484, name: 'Union Ads' },
    //     { value: 300, name: 'Video Ads' }
    //   ],
    // }
  ],
  GRAPHIC: [
    {
      type: 'text',
      left: 'center',
      top: 'middle',
      style: {
        text: '默认文字', // 要显示的默认文字
        fill: '#000', // 文字的颜色
        fontSize: 18 // 文字的字体大小
      }
    }
  ],
  TYPE: 'line'
});
</script>
